import React, { Component } from 'react';
import Checkbtn from './UI/checkbtn'
import Slider from './UI/slider'
import Slider2 from './UI/slider2'
import Search from '../cookbook/UI/search'
import connect from './connect'


class index extends Component {

    state={
        selected:0,
    }


    getSelected(index){
        this.setState({
            selected:index
        })

    }

    render() {
        console.log(this.state.selected)
        return (
            <div style={{height:'100%',overflow:'hidden'}} > 

                <Checkbtn fn={this.getSelected.bind(this)} />
                <Search />
                {this.state.selected === 0 ? <Slider /> : <Slider2 />}
            </div>
        );
    }
    componentDidMount(){
        this.props.category()
        this.props.material()
    }

}

export default connect(index);
